<html>
<head>  
<!-- The Head tag is used to create a title of web page, CSS syntax for a web page, and helps in written a JavaScript code. -->  
  <link href="https://rainppr.gitee.io/my-vscode/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
  <script src="https://rainppr.gitee.io/my-vscode/popper.min.js" crossorigin="anonymous"></script>
  <script src="https://rainppr.gitee.io/my-vscode/bootstrap.min.js" crossorigin="anonymous"></script>




<!-- Yandex.Metrika counter -->
<script type="text/javascript" >
   (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
   m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
   (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");

   ym(83171920, "init", {
        clickmap:true,
        trackLinks:true,
        accurateTrackBounce:true
   });
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/83171920" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->





  <title> Rating converter </title>

  <style>
    html,body{
  overflow-y: scroll; }
  .centered {
  display: flex;
  align-items: center;
  justify-content: center;
}
    /*overflow-y: scroll;*/
    /*max-height: 500px;*/
/*    background-color: #3366CC; /* Цвет фона веб-страницы */
   footer{
  /*position:static;*/
 }
   h1 {
/*    background-color: RGB(249, 201, 16); /* Цвет фона под заголовком */
   }
   p {
/*    background-color: maroon;  Цвет фона под текстом параграфа 
    color: white; /* Цвет текста */
   }
  </style>

  <link rel="icon" href="rating/src/icon_.png" type="image/icon type">

</head>
<body>
  <!-- style="height:700px;" -->
<div class="d-flex justify-content-center align-items-center"><span>

<!-- The Body tag is used to display the content on a web page. In this example we do not specify any content or any tag, so in output nothing will display on the web page. -->
<center>
  <br><br><br>

  <h1>
    <b>
      AtCoder to CodeForces Converter:
    </b>
  </h1>
  <br>

  <div class="input-group mb-3 centered">
    <div class="col-5">
      <input type="number" class="form-control" name = "n1" id="AC_input" min="-1000" max="50000000" placeholder="AtCoder rating">
    </div>
    <div class="input-group-append">
      <button type="button" class="btn btn-primary" id="AC2CFbutton">Convert</button>
    </div>
  </div>

  <text style="color:grey">or</text>

  <br>
  <div class="input-group mb-3 centered">
    <div class="col-5">
      <input type="text" class="form-control" name = "n3" id="ACname_input"placeholder="AtCoder handle">
    </div>
    <div class="input-group-append">
      <button type="button" class="btn btn-primary" id="ACname2CFbutton">Convert</button>
    </div>
  </div>

    <small><em>
    <text style="color:grey" id="ACproblem1"></text></em></small>

<!--  style="color: #FC363B; background-color: #7BDCBB;" -->

  <p id="AC2CFrating"> 
    <h3><b><text id="ACname"></text>
    <text>  </text>
    <text id="ACrating"></text>
    <text id="AC->"></text>
    <text id="CFprename1"></text><text id="CFname1"></text>
    <text>  </text>
    <text id="CFrating1" title="your expected rating on another platform"></text></b></h3>
    <br>
    <!-- <text> - your expected CodeForces performance </text> -->
  </p>

  <h1>
    <b>
      CodeForces to AtCoder Converter:
    </b>
  </h1>

  <br>

  <div class="input-group mb-3 centered">
    <div class="col-5">
      <input type="number" class="form-control" name = "n2" id="CF_input" min="-1000" max="50000000" placeholder="CodeForces rating">
    </div>
    <div class="input-group-append">
      <button type="button" class="btn btn-primary" id="CF2ACbutton">Convert</button>
    </div>
  </div>

  <text style="color:grey">or</text>
  <br>

  <div class="input-group mb-3 centered">
    <div class="col-5">
      <input type="text" class="form-control" name = "n4" id="CFname_input" placeholder="CodeForces handle">
    </div>
    <div class="input-group-append">
      <button type="button" class="btn btn-primary" id="CFname2ACbutton">Convert</button>
    </div>
  </div>

  <p id="CF2ACrating">
    <h3><b><text id="CFprename"></text><text id="CFname"></text>
    <text>  </text>
    <text id="CFrating"></text>
    <text id="CF->"></text>
    <text id="ACname1"></text>
    <text>  </text>
    <text id="ACrating1" title="your expected rating on another platform"></text></b></h3>
    <br>
    <!-- <text> - your expected AtCoder performance </text> -->
  </p>

  <text style="color:gray"><em>
  <a href = "mailto:ivan-belkov2@ya.ru" style="color: red">ivan-belkov2@ya.ru</a>
  <br> - here you can send any questions, wishes or suggestions.</em></text>

  <small><em><text id="testinfo"></text></em></small>
  <script src="converter.js">
  </script>

</center>
</span>
</div>

</body>

</html>
